<template>
    <div>
        <el-descriptions class="margin-top" title="员工信息表" :column="4"  border>
            <template slot="extra">
                <el-button type="primary" size="medium" @click="addEmp">分配账号</el-button>
                <el-button type="danger" size="medium" @click="refuseEmp">拒绝</el-button>
            </template>
            <el-descriptions-item>
                <template slot="label">
                    <i class="el-icon-user"></i>
                    姓名
                </template>
                {{emp.realname}}
            </el-descriptions-item>
            <el-descriptions-item>
                <template slot="label">
                    <i class="el-icon-mobile-phone"></i>
                    手机号
                </template>
                {{emp.tel}}
            </el-descriptions-item>
            <el-descriptions-item >
                <template slot="label">
                    <i class="el-icon-location-outline"></i>
                    性别
                </template>
                <div v-if="emp.gender==1">男</div>
                <div v-else>女</div>
            </el-descriptions-item>
            <el-descriptions-item>
                <template slot="label">
                    <i class="el-icon-tickets"></i>
                    服务类别
                </template>
                <el-tag size="small">{{emp.category}}</el-tag>
            </el-descriptions-item>
            <el-descriptions-item >
                <template slot="label">
                    <i class="el-icon-mobile-phone"></i>
                    身份证号
                </template>
                {{emp.idcard}}
            </el-descriptions-item>
            <el-descriptions-item :span="3">
                <template slot="label">
                    <i class="el-icon-office-building"></i>
                    个人介绍
                </template>
                {{emp.introduce}}
            </el-descriptions-item>
            <el-descriptions-item>
                <template slot="label">
                    <i class="el-icon-user"></i>
                    个人证件照
                </template>
                <el-image
                        style="width: 100px; height: 100px"
                        :src="emp.empAvatar"
                        :preview-src-list="empAvatar"></el-image>
            </el-descriptions-item>
            <el-descriptions-item>
                <template slot="label">
                    <i class="el-icon-user"></i>
                    身份证正面照
                </template>
                <el-image
                        style="width: 100px; height: 100px"
                        :src="emp.idphotoFront"
                        :preview-src-list="idphotoFront"></el-image>
            </el-descriptions-item>
            <el-descriptions-item>
                <template slot="label">
                    <i class="el-icon-user"></i>
                    身份证反面照
                </template>
                <el-image
                        style="width: 100px; height: 100px"
                        :src="emp.idphotoCon"
                        :preview-src-list="idphotoCon"></el-image>
            </el-descriptions-item>
        </el-descriptions>
    </div>
</template>

<script>
    export default {
        name: "checkEmpInfo",
        data() {
            return {
                emp:{},
                empAvatar:[],
                idphotoFront:[],
                idphotoCon:[]
            };
        },
        created() {
           var eid=this.$route.query.eid
           // console.log(eid)
            var that=this;
            this.$ajax.post('/jz/emp/getEmpInfoById?id='+eid).then(function (resp) {
                console.log(resp.data);
                if(resp.data.status==200){
                    that.emp=resp.data.emp;
                    that.empAvatar.push(resp.data.emp.empAvatar)
                    that.idphotoFront.push(resp.data.emp.idphotoFront)
                    that.idphotoCon.push(resp.data.emp.idphotoCon)
                }
            })
        },

        methods:{
            addEmp(){
                var that=this;
                this.$ajax.post('/jz/emp/addEmp?id='+this.emp.id).then(function (resp) {
                    //console.log(resp.data);
                    if(resp.data.status==200){
                        that.$message({
                            message: '已分配员工账号',
                            type: 'success'
                        });
                        that.$router.push({
                            path:'/checkEmp'
                        })
                    }
                    if(resp.data.status==204){
                        that.$message.error('分配账号失败');
                    }
                })
            },

            refuseEmp(){
                var that=this;
                this.$ajax.post('/jz/emp/refuseEmp?id='+this.emp.id).then(function (resp) {
                    console.log(resp.data);
                    if(resp.data.status==200){
                        that.$message({
                            message: '已拒绝',
                            type: 'success'
                        });
                        that.$router.push({
                            path:'/checkEmp'
                        })
                    }
                    if(resp.data.status==204){
                        that.$message.error('拒绝失败');
                    }
                })
            }
        }
    }
</script>

<style scoped>

</style>
